border-1px-bottom($color)
  position relative
  &::after
    content ''
    position absolute
    bottom 0
    left 0
    width 100%
    border-bottom 1px solid $color
    box-shadow 0.2px 0px 0.2px 0.2px $color
border-1px-top($color)
  position relative
  &::before
    content ''
    position absolute
    border-top 1px solid $color
    left 0
    top 0
    width 100%
border-1px-left($color)
  position relative
  &::before
    content ''
    position absolute
    border-left 1px solid $color
    left 0
    top 0
    height 100%
border-1px-right($color)
  position relative
  &::after
    content ''
    position absolute
    border-right 1px solid $color
    right 0
    top 0
    height 100%
bg-image($url, w, h)
  width unit(w, px)
  height unit(h, px)
  background-image url($url + '@2x.png')
  @media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3)
    background-image url($url + '@3x.png')
  background-size unit(w, px) unit(h, px)
  background-repeat no-repeat
padding(t, r, b, l)
  padding unit(t, px) unit(r, px) unit(b, px) unit(l, px)
margin(t, r, b, l)
  margin unit(t, px) unit(r, px) unit(b, px) unit(l, px)
border-none()
  &:after, &:before
    content ''
    display none
    height 0
    overflow hidden
animat()
  position relative
  animation mymove 0.35s 1
  -webkit-animation mymove 0.35s 1
  /* Safari and Chrome */
  animation-direction alternate
  /* 轮流反向播放动画。 */
  animation-timing-function linear
  /* 动画的速度曲线 */
  /* Safari 和 Chrome */
  -webkit-animation-direction alternate
  /* 轮流反向播放动画。 */
  -webkit-animation-timing-function linear
  /* 动画的速度曲线 */
@keyframes mymove
  0%
    transform scale(0.85)
    /* 开始为原始大小 */
  25%
    transform scale(1)
    /* 放大1.1倍 */
  50%
    transform scale(1.25)
  75%
    transform scale(0.9)
  100%
    transform scale(1)
